<template>
  <div id="wrapper">
    <nav class="top">
      <a @click="back()">
        <img class="left" src="../../assets/img/img.../xingzhuang164.png" alt="">
      </a>
      <span class="wenzi">我的商城</span>

      <div class="gui">

        <a href="">神灯值
          <img src="../../assets/img/img.../xingzhuang2.png" alt="">

        </a>
      </div>
      <!--神灯规则-->

      <!--昵称头像-->
      <div class="ni">
        <a  href="">
          <p class="number">100</p>
          <span><img src="../../assets/img/img.../shengdeng222.png" alt=""></span>
        </a>
      </div>
    </nav>
    <!--查找框-->
    <!--<input type="text" >-->
    <div class="input">
      <img src="../../assets/img/img.../shengdeng222.png" alt="">
      <span>查找你想要的商品</span>

    </div>
    <!--精选-->
    <div class="select">
      <ul>
        <li>精选</li>
        <li>面膜</li>
        <li>母婴</li>
        <li>美妆</li>
        <li>眼妆</li>
      </ul>
    </div>
  </div>
</template>
<script>
  export default {


    methods:{
      back(){
        this.$router.go(-1);
      }
    }
  }
</script>
<style scoped>
  .top{
    width: 100%;
    height: 8rem;
    background-color: #e53e42;
  }
  .top{
    position: relative;
  }
  .left{
    width:0.7rem;
  }
  .wenzi{
    font-family: MicrosoftYaHei;
    font-size: 0.89rem;
    font-weight: normal;
    font-stretch: normal;
    line-height: 2.25rem;
    letter-spacing: 0.04rem;
    color: white;
    position: absolute;
    top: 1rem;
    left: 6rem;
  }
  img{
    width: 1rem;
  }
  .left {
    position: absolute;
    top: 1.5rem;
    left: 0.7rem;
  }

  .gui img{
    width: 0.8rem;
  }
  .gui a{
    font-size:0.6rem;
    color: white;
    position: absolute;
    left:12rem;
    top:0.8rem;
  }
  .ni a{
    font-size: 0.7rem;
    position: absolute;
    left: 6.7rem;
    top:3rem;
    color: white;
    text-align: center;
  }
  .ni .bgtu{
    width:2rem;

  }
  .ni a .number{
    font-size:1.5rem;
    color: gold;
    font-weight:200;
  }
  .ni a span img{
    position: absolute;
    left: 2.8rem;
    top:4.2rem;
  }
  /*查找框*/
  .input{
    width: 15rem;
    height: 1.3rem;
    border:1px solid #cccccc;
    text-align: center;
    margin: 0.5rem;

  }
  .input span{
    font-size:0.5rem;
    color: #e83d41;
  }
  /*精选*/
  .select{
    width: 100%;
    height: 1.6rem;
    background: #680a0c;
    text-align: center;
  }

  .select ul li{
    display: inline-block;
    font-size:0.6rem;
    color: #ffffff;
    margin-left: 1rem ;
  }
</style>



